<div>
    <form class="form-horizontal bv-form"  role="form"  id="updateForm">
        <fieldset>
            <legend>基本信息</legend>
            <div class="form-group">
                <label class="col-sm-3 control-label">团队信息</label>
                <div class="col-sm-5">
                    <input type="text"  class="form-control" id="team_id" name="team_id" value="{$team_one['team_name']}">
                    <input type="hidden"  class="form-control" id="team_one" name="team_one" value="{$team_one['team_id']}">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">添加团队决策层</label>
                <div class="col-sm-5">
                    <select id="custom-headers" multiple="multiple" class="searchable" name="teamRole1[]">
                        {volist name="userInfo" id="vo"}
                        <option value="{$vo.user_id}">{$vo.user_username}({$vo.user_phone})</option>
                        {/volist}
                    </select>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">添加团队管理层</label>
                <div class="col-sm-5">
                    <select multiple="multiple" class="searchable" name="teamRole2[]">
                        {volist name="userInfo" id="vo"}
                        <option value="{$vo.user_id}">{$vo.user_username}({$vo.user_phone})</option>
                        {/volist}
                    </select>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">添加团队成员层</label>
                <div class="col-sm-5">
                    <select multiple="multiple" class="searchable" name="teamRole3[]">
                        {volist name="userInfo" id="vo"}
                        <option value="{$vo.user_id}">{$vo.user_username}({$vo.user_phone})</option>
                        {/volist}
                    </select>
                </div>
            </div>
        </fieldset>
    </form>

</div>
<script>
    $('.searchable').multiSelect({
        selectableHeader: "<input type='text' class='search-input' autocomplete='off'>",
        selectionHeader: "<input type='text' class='search-input' autocomplete='off'>",
        afterInit: function(ms){
            var that = this,
                    $selectableSearch = that.$selectableUl.prev(),
                    $selectionSearch = that.$selectionUl.prev(),
                    selectableSearchString = '#'+that.$container.attr('id')+' .ms-elem-selectable:not(.ms-selected)',
                    selectionSearchString = '#'+that.$container.attr('id')+' .ms-elem-selection.ms-selected';

            that.qs1 = $selectableSearch.quicksearch(selectableSearchString)
                    .on('keydown', function(e){
                        if (e.which === 40){
                            that.$selectableUl.focus();
                            return false;
                        }
                    });

            that.qs2 = $selectionSearch.quicksearch(selectionSearchString)
                    .on('keydown', function(e){
                        if (e.which == 40){
                            that.$selectionUl.focus();
                            return false;
                        }
                    });
        },
        afterSelect: function(){
            this.qs1.cache();
            this.qs2.cache();
        },
        afterDeselect: function(){
            this.qs1.cache();
            this.qs2.cache();
        }
    });

</script>





